<template>
    <div>
        <h1 style="text-align: center;">登录</h1>
        <van-form @submit="onSubmit">
        <van-field
            v-model="username"
            name="username"
            label="用户名"
            placeholder="用户名"
            :rules="rules.username"
        />
        <van-field
            v-model="password"
            type="password"
            name="password"
            label="密码"
            placeholder="密码"
            :rules="rules.password"
        />
        <div style="margin: 16px;">
            <van-button round block type="info" native-type="submit">提交</van-button>
        </div>
        <div @click="onclick" class="zc">没还有账号,去注册</div>
        </van-form>
    </div>
</template>

<script>
import { Form,Button } from 'vant';
import { Field } from 'vant';
import { Toast } from 'vant';
import { setCookie } from '@/utils/cookie';
import axios from 'axios'
import { showSuccessToast, showFailToast } from 'vant';
import { createApp } from 'vue';
import 'vant/lib/index.css';
const app = createApp()
app.use(Toast);
app.use(Form);
app.use(Field);
app.use(Button);
export default {
    data () {
        return {
            rules: {
                username: [
                    { required: true, message: '请填写用户名' }
                ],
                password: [
                    { required: true, message: '请填写密码' }
                ]
            },
            username: '',
            password: '',
        }
    },
    methods: {
        onSubmit(values) {
            
            let username = values.username
            let password = values.password
            // console.log(username,password,1)
            // Logina(username,password).then(res =>{
            //     console.log(res);
            // })
            axios({
                method:'post',
                url:'/front/login',
                data:{
                    username,
                    password
                },
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded'
                }
            }).then(res=>{
                console.log(res,111);
                let {error_code, msg} = res
                if  (error_code === 200){
                    setCookie('username', res.data.username, 7200)
                    setCookie('userId', res.data.userId, 7200)
                    localStorage.setItem('token', res.data.token)
                    // Toast.success(msg)
                    // console.log(msg);
                    showSuccessToast(msg);
                    this.$router.push('/my')
                }
                showFailToast(msg);
                // Toast.fail(msg)

                })
        },
        onclick() {
            this.$router.push({path:'/register'})
        }
    }
}
</script>

<style>
    .zc{
        margin-top: 10px;
        text-align: center;
    }
</style>
